<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: Liubuzhu
  Date: 2023/12/16
  Time: ฅ(΅•ㅅ•΅❀)ฅ 21:14
--%>
<%@ page contentType="text/html;charset=UTF-8" isELIgnored="false" language="java" %>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>玩家注册</title>
  <style>

    body{
      background-image: url("<c:url value="/img/login/bg.png"/>");
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center;
      height: 100vh;
    }

    .custom-links {
      text-decoration: none;
      color: gray;
    }

    .vertical-line {
      height: 20px;
      width: 2px;
      background-color: #ccc;
    }
  </style>
  <link rel="stylesheet" href="<c:url value="/css/bootstrap.min.css"/>">
   <script src="<c:url value="/js/jquery.min.js"/>"></script>
  <script src="<c:url value="/js/bootstrap.min.js"/>"></script>
</head>

<body>
<div class="container col-xl-10 col-xxl-8 px-4 py-2">
  <div class="row align-items-center g-lg-5 " style="padding-top: 30px;">
    <div class="col-md-12 mx-auto col-lg-8">
      <form class="p-4 p-md-5 border rounded-3 bg-light" action="<c:url value="/register"/>" method="post">
        <h2 class="mb-4">注册</h2>
        <div class="row mb-3">
          <div class="col-md-6">
            <div class="form-floating mb-3">
              <input type="text" class="form-control" id="account" placeholder="账号">
              <label for="account">账号</label>
            </div>
          </div>
          <div class="col-md-6">
            <div class="form-floating mb-3">
              <input type="text" class="form-control" id="name" placeholder="名称">
              <label for="name">名称</label>
            </div>
          </div>
        </div>
        <div class="row mb-3">
          <div class="col-md-6">
            <div class="form-floating mb-3">
              <input type="email" class="form-control" id="email" placeholder="name@example.com">
              <label for="email">邮箱</label>
            </div>
          </div>
          <div class="col-md-6">
            <div class="form-floating mb-3">
              <input type="tel" class="form-control" id="phone" placeholder="联系方式">
              <label for="phone">联系方式</label>
            </div>
          </div>
        </div>
        <div class="row mb-3">
          <div class="col-md-6">
            <div class="form-floating mb-3">
              <input type="password" class="form-control" id="password" placeholder="Password">
              <label for="password">密码</label>
            </div>
          </div>
          <div class="col-md-6">
            <div class="form-floating mb-3">
              <input type="password" class="form-control" id="confirmPassword" placeholder="Confirm Password">
              <label for="confirmPassword">确认密码</label>
            </div>
          </div>
          <%= request.getAttribute("error")%>
        </div>
        <button class="w-100 btn btn-lg btn-primary" type="submit">注册</button>
        <hr class="my-4">
        <div class="d-flex justify-content-end align-items-center">
          <a href="<c:url value="/view/player/playerLogin.jsp"/>" class="custom-links me-2">已有账号？立即登录</a>
        </div>
      </form>
    </div>
  </div>
</div>



<script>
  function register() {
    console.log("进入注册");
    // let username = $("#username").val();
    // let password = $("#password").val();
    // let email = $("#email").val();
    // let name = $("#name").val();
    // let contact = $("#contact").val();
    // let confirmPassword = $("#confirmPassword").val();
    // let identity = $("#identity").val();
    // console.log(username);
    // if (password !== confirmPassword) {
    //   alert("密码和确认密码不匹配");
    //   return;
    // }
    //
    // $.ajax({
    //   type: "POST",
    //   url: "http://localhost:8080/funplay_war/register",
    //   data: { username: username, password: password, identity: identity, name: name, email: email, contact: contact },
    //   dataType: "json",
    //   success: function(response) {
    //     if (response.success) {
    //       // 注册成功
    //       alert("注册成功！");
    //       // 跳转
    //       window.location.href = "index.jsp";
    //     } else {
    //       // 注册失败
    //       alert("注册失败: " + response.error);
    //     }
    //   },
    //   error: function(xhr, status, error) {
    //     // 处理Ajax请求失败
    //     console.error("Ajax request failed: " + status + ", " + error);
    //   }
    // });
  }
</script>

</body>
</html>
